/**
 * Created by xiteng on 2017/5/16.
 */
import React, {Component} from 'react';
import {
    Text,
    View,
    TouchableOpacity,
    Image,
    PixelRatio
} from 'react-native';
import CommonUtil from '../util/CommonUtil'

export default class ShopCell extends Component{
    render(){
        let {callback,shop} = this.props;
        let typeView=this._merchantType(shop.certification);
        return <TouchableOpacity
            activeOpacity={0.9}
            onPress={callback}
            style={[{flexDirection:'row',justifyContent:'space-between',paddingVertical:10,paddingHorizontal:5,backgroundColor:'white'},styles.borderBottom]}>
            <View style={{flexDirection:'row'}}>
                <Image
                    style={{width:80,height:80,resizeMode:'contain'}}
                    source={{uri:shop.imageUrl}}/>
                <View style={{justifyContent:'space-around',marginLeft:10}}>
                    <View style={{flexDirection:'row',alignItems:'center'}}>
                        <Text style={{color:'black',fontSize:16,marginRight:5}}>{shop.name}</Text>

                        {
                            shop.certification ? <Image style={{resizeMode: 'contain', width: 40, height: 20}}
                                                        source={require('../../asserts/shop/lable_v.png')}></Image> :
                                (null)
                        }

                    </View>
                    <View style={{flexDirection:'row',alignItems:'center'}}>
                        {
                             CommonUtil.getStoreStars(shop.score)
                        }
                        <Text style={{marginLeft:5}}>月售{shop.saleMount+''}</Text>
                    </View>
                    <View style={{flexDirection:'row',alignItems:'center'}}>
                        <Image style={{width:12,height:16,marginRight:3,resizeMode:'contain'}} source={require('../../asserts/common/station_details_icon_location.png')}/>
                        <Text numberOfLines={1} style={{maxWidth:180}}>{shop.address}</Text>
                    </View>
                </View>
            </View>
            <View style={{justifyContent:'space-around'}}>
                <Text></Text>
                <Text style={styles.text}></Text>
                <Text style={styles.text}>{shop.distance+''}</Text>
            </View>
        </TouchableOpacity>
    }
    _stars(){
        let stars = [];
        for(let i = 0;i<5;i++){
            stars.push( <Image key={i} style={{width:12,height:12}} source={require('../../asserts/shop/icon_star_orange.png')}></Image>)
        }
        return stars
    }
    _merchantType(merchantType){
        if(merchantType=='旗舰店'){
            return <Image style={{resizeMode:'contain',width:40,height:20}} source={require('../../asserts/shop/lable_qijiandian.png')}></Image>
        }else if(merchantType=='认证店铺'){
            return <Image style={{resizeMode:'contain',width:40,height:20}} source={require('../../asserts/shop/lable_v.png')}></Image>
        }else {
            return <Image style={{resizeMode:'contain',width:40,height:20}} source={require('../../asserts/shop/lable_v.png')}></Image>
        }
    }
}


const styles = {
    wrapper: {
    },
    flex: {
        flex: 1
    },
    text: {
        color: 'gray',
        textAlign:'right',
        fontWeight:'100'
    },
    borderBottom:{
        borderBottomColor:'#f5f5f5',
        borderBottomWidth:1/PixelRatio.get()
    }
}
